<template>
  <div class="article">
    <el-table
      v-loading="isLoading"
      :data="tableData"
      style="width: 100%">
      <el-table-column
        prop="objectId"
        label="ID"
        width="240"
        align="center"
      >
      </el-table-column>
      <el-table-column
        prop="content"
        label="标题">
      </el-table-column>
      <el-table-column
        prop="createdAt"
        label="创建时间"
        width="200">
      </el-table-column>
      <el-table-column
        prop="user"
        label="创建用户"
        width="100"
      >
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import axios from "axios";
export default {
  name: "Article",
  data() {
    return {
      isLoading: false,
      tableData: []
    }
  },
  async created() {
    try {
      this.isLoading = true
      const res = await this.fetchList()
      console.log(res)
      this.tableData = res.data.data
    } catch (e) {
      this.$message({
        type: 'error',
        message: '网络错误，请刷新重试'
      })
    } finally {
      this.isLoading = false
    }
  },
  methods: {
    fetchList() {
      return axios('https://api.yizhanketang.cn/api/v1/todos')
    }
  }
}
</script>
